<!DOCTYPE html>
<html lang="zh-cn">
  <head>
    <meta charset="utf-8"/>
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
	<link rel="stylesheet" type="text/css" href="../public/css/index.css"/>
	<script src="../public/js/jquery.js"></script>
	<!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
	<link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

	<!-- 可选的 Bootstrap 主题文件（一般不用引入） -->
	<link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">

	<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
	<script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
    <title><?php echo $title;?></title>
  </head>
  <body>
		<div id="head"><?php model();?></div>
		<h2>沐水莲心-在线考试系统欢迎你！</h2>
		<div id ="menu"> 
            <ul class="fmt">
				<li ><a href="../index.php">主页</a></li>
				<li ><a href="single.php">单选训练</a></li>   
				<li ><a href="judge.php">判断训练</a></li> 
				<li ><a href="multiple.php">多选训练</a></li> 
				<li ><a href="fill.php">填空训练</a></li>
				<li class="active"><a href="userInfo.php">考生信息</a></li>
				<li ><a href="test.php">在线考试</a></li>    
                <li ><a href="list.php">成绩排名</a></li>                                                
            </ul> 
        </div>
		<div id="userForm">
		<form method="post"  action="userInfo_deal.php" enctype="multipart/form-data">
		<ul class="list-group">
		  <li class="list-group-item">姓名：<input type="text" name="name" disabled value="<?php echo $row['name'];?>"/><span class="formData">不能修改</span></li>
		  <li class="list-group-item">昵称：<input type="text" name="nickname" placeholder="请输入昵称 2-6个字" value="<?php echo $row['nickname'];?>"/><span id="nickname" class="formData"></span></li>
		  <li class="list-group-item">性别：
		  <?php if($row['sex'] == '男'):?>
                
		
                  男 <input type="radio" name="sex" value="男" title="男" checked="checked">
                  女 <input type="radio" name="sex" value="女" title="女">
				 
              
				<?php endif;?>
				<?php if($row['sex'] == '女'):?>
               
		
                  男 <input type="radio" name="sex" value="男" title="男">
                  女 <input type="radio" name="sex" value="女" title="女" checked="checked">
				 
            
				<?php endif;?>
		  
		  </li>
		  <li class="list-group-item">头像：<button type="button" id="img" class="btn btn-info">查看头像</button></li>
		  <li class="list-group-item">上传头像<input type="file" name="file" value=""/></li>
		  <li class="list-group-item">手机：<input type="text" name="tel" placeholder="请输入手机号" value="<?php echo $row['tel'];?>" /><span id="tel" class="formData"></span></li>
		  <li class="list-group-item">邮箱：<input type="text" name="email" placeholder="请输入邮箱" value="<?php echo $row['email'];?>" /><span id="email" class="formData"></span></li>
		  <li class="list-group-item">备注：<textarea  name="remark" value=""><?php echo $row['remark'];?></textarea></li>
		</ul>
		<button type="submit" class="btn btn-info">提交</button>
		</form>
		
		</div>
		<footer>
            <p>本网页用于设计在线考试卷系统</p>
        </footer>
  </body>
</html>

<script src="../public/plugin/layer/layer.js"></script>
<script>
$(function(){
	$("#img").click(function(event){
		
		layer.open({
		  type: 1,
		  title:'头像',
		  skin: 'layui-layer-demo', //样式类名
		  closeBtn: 0, //不显示关闭按钮
		  anim: 2,
		  shadeClose: true, //开启遮罩关闭
		  content: '<img src="../public/uploads/img/<?php echo $row["image"];?>" style="width:200px;height:200px;">'
		});
	});
	
	//验证昵称
	$("input[name='nickname']").blur(function(){
		var nickname = $("input[name='nickname']").val();
		if(nickname.length < 2 || nickname.length > 6){
			$("#nickname").html('<span style="color:red;height:38px;;letter-spacing:2px;" >2到6个字</span>');
			$("input[name='nickname']").val("");
			return false;
			
		}else{
			$("#nickname").text("");
		}
		
	});
	//验证手机号
	$("input[name='tel']").blur(function(){
		var tel = $("input[name='tel']").val();
		var phone = /^1[3|4|5|7|8][0-9]{9}$/;
		if(phone.test(tel)){
			$("#tel").text("");
		}else{
			
			$("#tel").html('<span style="color:red;height:38px;;letter-spacing:2px;" >手机号不正确</span>');
			$("input[name='tel']").val("");
			return false;
		}
		
	});
	//验证邮箱
	$("input[name='email']").blur(function(){
		var email = $("input[name='email']").val();
		//var e = /^[A-Za-z\d]+([-_.][A-Za-z\d]+)*@([A-Za-z\d]+[-.])+[A-Za-z\d]{2,4}$/;
		var e = /^\w+@[a-zA-Z0-9]{2,10}(?:\.[a-z]{2,4}){1,3}$/;
		if(e.test(email)){
			$("#email").text("");
		}else{
			
			$("#email").html('<span style="color:red;height:38px;;letter-spacing:2px;" >邮箱不正确</span>');
			$("input[name='email']").val("");
			return false;
		}
		
	});
	
});
</script>